@charset "utf-8";

#navigation-panel {
    overflow:visible;
    position:relative;
}
		
/* main image box */
#main-image-box {
    margin:0;
    width:550px;
    height:340px;
    position:relative;
    margin-bottom:20px;
}
/* container Styles */
#main-image-box .container {
    margin-top:20px;
}
#main-image-box .container h1 {
    font-family:Georgia, "Times New Roman", Times, serif;
    font-style:italic;
    font-size:24px;
    border:none;
    padding:2px 0;
}
#main-image-box .container p {
    display:none;
    margin-top:150px;
    position:absolute;
    bottom:40px;
    width:430px;
}

#main-image-box #calcio {
    background-image:url("../Images/calcio.jpg");
    clip:rect(0px 136px 340px 0px);
}
#main-image-box #calcio .container {
    margin-left:20px;
    margin-top:280px;
}
#main-image-box #calcio .container h1 {
    color:#fff;
}
#main-image-box #calcio .container span {
    background-color:#fff;
    background:rgba(255, 255, 255, 0.8);
    color:#000;
}

#main-image-box #basket {
    background-image:url("../Images/basket.jpg");
    clip:rect(0px 273px 340px 138px);
}
#main-image-box #basket .container {
    margin-left:45px;
    width:430px;
}
#main-image-box #basket .container h1 {
    margin-left:118px;
    color:#fff;
}
#main-image-box #basket .container span {
    background-color:#fff;
    background: rgba(0, 0, 0, 0.8);
    color:#fff;
}

#main-image-box #tennis {
    background-image:url("../Images/tennis.jpg");
    clip:rect(0px 410px 340px 275px);
}
#main-image-box #tennis .container {
    margin-left:70px;
    margin-top:280px;
}
#main-image-box #tennis .container h1 {
    margin-left:240px;
    color:#fff;
}
#main-image-box #tennis .container span {
    background-color:#fff;
    background: rgba(255, 255, 255, 0.8);
    color:#fff;
}
#main-image-box #eventi {
    background-image:url("../Images/eventi.jpg");
    clip:rect(0px 550px 340px 412px);
}
#main-image-box #eventi .container {
    margin-left:95px;
}
#main-image-box #eventi .container h1 {
    margin-left:351px;
    color:#fff;
}
#main-image-box #eventi .container span {
    background-color:#fff;
    background: rgba(255, 255, 255, 0.8);
    color:#fff;
}

#main-image-box .clip {
    width:550px;
    height:340px;
    position:absolute;
    top:0;
    left:0;
    display:block;
    background-color:#fff;
    background-position:center top;
    background-repeat:no-repeat;
    z-index:1;
}
#main-image-box .facets:hover {
    clip:rect(0px 550px 340px 0px) !important;
}
#main-image-box .facets:hover .container {
    display:block;
}
#main-image-box .facets:hover {
    z-index:10 !important;
}

#main-image-box .facets:hover .container p  {
    display:block;
}
